<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>MyPetStore</title>
<!--    <link rel="StyleSheet" href="../css/jpetstore.css" type="text/css" media="screen"/>-->
    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no"/>
    <link rel="stylesheet" href="../css/main.css"/>
    <noscript>
        <link rel="stylesheet" href="../css/noscript.css"/>
    </noscript>
</head>
<body class="is-preload">
<!-- Wrapper -->
<div id="wrapper">
    <div th:replace="common/top"></div>
    <!-- Main -->
    <div id="main" class="alt">
        <section id="banner" class="style2">
            <div class="inner">
							<span class="image">
								<img src="../images/pic07.jpg" alt=""/>
							</span>
                <header class="major">
                    <a th:href="@{/catalog/viewProduct(productId=${item.productId})}" th:text="'Return to ' + ${item.productId}">Return to ${sessionScope.product.categoryId}</a>
                </header>
                <!--                <div class="content">-->
                <!--                    <p>Lorem ipsum dolor sit amet nullam consequat<br />-->
                <!--                        sed veroeros. tempus adipiscing nulla.</p>-->
                <!--                </div>-->
            </div>
        </section>
        <!-- One -->
        <section id="one" class="spotlights">
            <section>
                <a class="image">
                    <img th:src="${product.description}" alt="" data-position="center center"/>
                </a>
            <div class="content">
                <div class="inner">
                <header class="major">
                    <h1 th:text="${item.itemId}">ItemId</h1>
                </header>
<!--                <span class="image main" th:src="@{product.description}"></span>-->
                <p th:text="${item.attribute1}"></p>
                <p th:if="${item.quantity<=0}">Back ordered.</p>
                <p th:if="${item.quantity>0}"><p th:text="${item.quantity}+' in stock.'"></p></p>
                <p th:text="${product.name}">product name</p>
                <p th:text="'$'+${#numbers.formatDecimal(item.listPrice,1,'COMMA',2,'POINT')}"></p>
                    <ul class="actions">
                        <li><a th:href="@{/cart/addItemToCart(workingItemId=${item.getItemId()})}" class="button">Add to Cart</a></li>
                    </ul>
            </div>

                    </div>
            </section>
        </section>

    </div>
    <div th:replace="common/bottom">

    </div>
</div>

</body>
</html>